<template>
  <div class="usrpwd">
    <div class="item">
      <a-input size="large" ref="userNameInput" v-model="userinfo.username" placeholder="手机号">
        <a-icon slot="prefix" type="user" />
        <a-tooltip slot="suffix" title="Extra information">
          <a-icon type="info-circle" style="color: rgba(0,0,0,.45)" />
        </a-tooltip>
      </a-input>
    </div>
    <div class="item">
      <a-input
        size="large"
        ref="userNameInput"
        v-model="userinfo.sms"
        placeholder="验证码"
      >
        <a-icon slot="prefix" type="lock" />
      </a-input>
      <a-button class="getSms" size='large'>获取验证码</a-button>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      userinfo: {
        username: '',
        password: ''
      }
    }
  }
}
</script>

<style lang='scss' scoped>
.item {
  display: flex;
  align-items: center;
  line-height: 1;
  margin-bottom: 2em;
  .getSms{
      margin-left: 1em;
  }
}
</style>
